<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1.0, user-scalable=0">

    <title>绑定手机</title>

    <link th:href="@{/AmazeUI-2.4.2/assets/css/admin.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/AmazeUI-2.4.2/assets/css/amazeui.css}" rel="stylesheet" type="text/css">

    <link th:href="@{/css/personal.css}" rel="stylesheet" type="text/css">
    <link th:href="@{/css/stepstyle.css}" rel="stylesheet" type="text/css">

    <script type="text/javascript" th:src="@{/js/jquery-1.7.2.min.js}"></script>
    <script th:src="@{/AmazeUI-2.4.2/assets/js/amazeui.js}"></script>
    <script th:src="@{/js/bindphone.js}"></script>
    <script th:inline="javascript">
        var basePath = "/wood";
    </script>
</head>

<body>
<th:block th:include="common :: header2"></th:block>
<th:block th:include="common :: category"></th:block>
<div class="center">
    <div class="col-main">
        <div class="main-wrap">

            <div class="am-cf am-padding">
                <div class="am-fl am-cf"><strong class="am-text-danger am-text-lg">绑定手机</strong> / <small>Bind&nbsp;Phone</small>
                </div>
            </div>
            <hr/>
            <!--进度条-->
            <div class="m-progress">
                <div class="m-progress-list">
							<span class="step-1 step">
                                <em class="u-progress-stage-bg"></em>
                                <i class="u-stage-icon-inner">1<em class="bg"></em></i>
                                <p class="stage-name">绑定手机</p>
                            </span>
                    <span class="step-2 step">
                                <em class="u-progress-stage-bg"></em>
                                <i class="u-stage-icon-inner">2<em class="bg"></em></i>
                                <p class="stage-name">完成</p>
                            </span>
                    <span class="u-progress-placeholder"></span>
                </div>
                <div class="u-progress-bar total-steps-2">
                    <div class="u-progress-bar-inner"></div>
                </div>
            </div>
            <form class="am-form am-form-horizontal">
                <div class="am-form-group bind">
                    <label for="user-phone" class="am-form-label">验证原号码</label>
                    <div class="am-form-content">
                        <span id="user-phone">
							<input type="tel" name="phone" id="phone" disabled="disabled"
                                   th:value="${session.User.phone}">
						</span>
                    </div>
                </div>
                <div class="am-form-group code">
                    <label for="user-code" class="am-form-label">验证码</label>
                    <div class="am-form-content">
                        <input type="tel" id="user-code" required placeholder="短信验证码">
                    </div>
                    <input type="button" class="am-btn am-btn-danger"  style="position: absolute;right: 0;top: 0;"
                           th:value="验证码" id="phoneCodeBtn" >
                    <!--                    <a class="btn" href="javascript:void(0);" onclick="sendMobileCode()" id="sendMobileCode">-->
                    <!--                        <div id="phoneCodeBtn" class="am-btn am-btn-danger">验证码</div>-->
                    </a>
                </div>
                <div class="am-form-group">
                    <label for="user-new-phone" class="am-form-label">验证新号码</label>
                    <div class="am-form-content">
                        <input type="tel" name="user-new-phone" id="user-new-phone" placeholder="绑定新手机号" required>
                    </div>
                </div>
                <div class="am-form-group code">
                    <label for="user-new-code" class="am-form-label">验证码</label>
                    <div class="am-form-content">
                        <input type="tel" name="user-new-code" id="user-new-code" placeholder="短信验证码" required>
                    </div>
                    <input type="button" class="am-btn am-btn-danger"  style="position: absolute;right: 0;top: 0;"
                           th:value="验证码" id="newPhone" >
                    <!--<a class="btn" href="javascript:void(0);" onclick="sendMobileCode();" id="sendMobileCode">
                        <div class="am-btn am-btn-danger">验证码</div>
                    </a>-->
                </div>
                <div class="info-btn">
                    <input type="submit" class="am-btn am-btn-danger"
                          id="changPhone" th:value="保存修改"  >
<!--                    <div class="am-btn am-btn-danger">保存修改</div>-->
                </div>

            </form>

        </div>
        <!--底部-->
        <th:block th:include="common :: footer"></th:block>
    </div>
    <th:block th:include="common :: menu"></th:block>
</div>

</body>

</html>